1. In FrontPage, click on File/New. You will be presented with dialog box that asks for the location of the web. If you are doing disk-based development, select the folder in which you want to save the web. If you are doing server-based development, you should specify the URL of the new web (e.g., http://cis2.stvincent.edu/martincc). If the drive or directory you want is not in the drop down list provided, you will have to type in the drive and the directory you want. If the directory you specify does not exist, it will create it for you on the specified drive. You are also presented with a number of templates and wizard choices. For our purposes, we will usually be using the One Page Web, the Empty Web, the Personal Web, or possibly the Corporate Web Presence.
   
   The One Page Web provides you with one blank webpage called “index.htm”.
   
   The Empty Web choice simply sets up a number of directories for the web and lets you add the pages as desired.
   
   If you choose Personal Web, you will be provided with a homepage, a interests page, a photo album page and a favorites page, which all have a very basic theme style.
   
   Choosing Corporate Web Presence will furnish you several dialog boxes asking what you would like to be included in your web. The types of things available include some standard templates for pages such as “Corporate Mission” and “Products and Services”, information to be provided on each webpage, such as the webmaster’s email address, and asks you to decide on a theme or style. The themes provide pre-designed backgrounds, buttons, navigation bars and more that can give your pages a consistent style.
   
   For now, just select Empty Web. Then go to File/New/Page and open a Normal Page .
   
   Right-click on the page, or select File/Properties… . Type in a title for the page. The title will be displayed in the titlebar of the browser whenever the page is viewed by a user. It will also be what appears in the Favorites list of a browser if the user adds the page to Favorites list. Select the Background tab of the Page Properties window. Here, you can indicate a background image to use as well as a background color, text color and hyperlink colors. Please note that the Background tab will only be available if you have not selected one of the “Themes” available with FrontPage. Hyperlink Rollover effects are also available on this tab.

1. If you want your webpages to be compatible with Netscape or other versions of Internet Explorer, do the following when you have the page open in Page View. Choose Tools/Page Options and click the Compatibility tab. In the first pulldown list, select Both IE and Netscape. In the second pulldown list, choose the browser versions.
2. You can add text to the page in much the same way you would in a word processor. Just begin typing. To create headings or lists, go to the first pulldown list under the toolbar at the top of the screen and choose a heading or list.

1. Now, add an image to the page by selecting Insert/Picture/ClipArt. If you want, you can use another image that you have by choosing From File instead of ClipArt. To locate the directory or folder for the file, on the insert dialog box that appears, click on the button in the lower right corner that has a magnifying glass over a folder on it. If you are using ClipArt, select a picture and then click on the picture and then click on the Insert Clip icon. The image will appear at your cursor position on the page.
   
2. Now, save your page. If you have used an image that is not ClipArt, you will see the Save Embedded Image dialog box. To save a copy of the image you inserted in the current web, select the file name (which will be in the dialog box) and choose Change Folder. A Change Folder dialog box will appear. Double-click on the Images folder to select it and click OK. Then, click on OK in the Save Embedded Image dialog box. You can left-justify, right-justify or center the picture by clicking the appropriate buttons on the toolbar, that do the same for text.
   
3. You can position the picture, change the dimensions of the picture and change the way that the text flows around the picture, by right clicking on the picture and choosing Picture Properties. Choose the Appearance tab. Here you can change the dimensions of the picture, add a border, and control the way the text flows around the picture. In the pulldown Layout list at the top of the dialog box, there are a number of choices:
   1. Bottom, Middle or Top will position your cursor, and therefore, any text that follows at one of these positions.
   2. If you want to float an image with text wrapped around it, choose Left or Right from this list.
   3. The other choices are used less often. Texttop will align text with the top of the image, Absmiddle aligns the image with the middle of the current line, Absbottom aligns the image with the bottom of the current line, and Baseline aligns the image with the text baseline of the current line.
4. You can create some distance between the text and the image by increasing the horizontal and vertical spacing.
   
5. Add alternate text for the image using the General tab on the Picture Properties dialog box. In the Alternate Representations box, type the phrase you want to appear to stand in for the graphic and then choose OK.

1. FrontPage lets you easily add hotspots to an image. Simply highlight the picture. In the Picture toolbar at the bottom of the page, choose one of the shape buttons. Position your cursor over the picture and it will appear like a crayon. Position the shape where you want it by dragging. A dialog box will appear for you to select the URL to link the hotspot to.
   
   NOTE: This is very convenient, but it will only work with servers that have FrontPage extensions installed. If you are planning to publish to a server that does not have these extensions installed, the hotspots will not work. You should follow the process described in section 8.5 Image Maps.
   
   
2. Thumbnail images are small images that appear on a page that are linked to the full image. There is a button on the toolbar (with a picture overlapped with a smaller picture) (or use CTRL+t) that makes a smaller copy of the image, puts that image on the page and links it to the original image. Note that this button is not available for clipart pictures.

1. Choose Table/Draw Table from the menubar. The cursor will turn into a pencil. Click at the point you want to start the table and drag across the page to the size desired. This represents the outline of your table. A Table Drawing toolbar should appear somewhere on the screen. If it doesn’t, go to the View menu, choose Toolbars and click Table.
2. To add more cells, click and drag the cursor from table or cell edge to another edge.
3. To change the size of a cell, position the cursor directly over a cell border until it turns into a double-sided arrow and drag to the position desired.
4. To remove a border, choose the Eraser icon on the Table Drawing toolbar that should have appeared when you chose to draw the table.
5. To further adjust the table’s properties, select Table/Properties from the menubar. If the table is being used to control layout, you probably do not want the borders to be showing, so change the border size to zero.

1. To add an opening transition effect, go to Format/PageTransitions. Select the event to which you want to add the transition (e.g., on opening the page, exiting the page, entering the site, etc.). Then select the type of transition desired. Keep in mind that too much activity such as transitions, animations, blinking can be distracting and annoying.

1. To insert a hyperlink, highlight the text or image for the hyperlink and choose Insert/Hyperlink from the menubar. A dialog box will appear asking for the file or URL that you want to link to.
2. To insert an internal link (a link to a section of the document you are currently in), you must first name the section. In FrontPage, this is done by choosing Bookmark from the Insert menu. You will be prompted for a name for the bookmark.If you look at the HTML code inserted, you will see that this choice adds an anchor tag with the name attribute, as described in the HTML Links section. You then add the hyperlink as describe above, but include the name of the bookmark in the "optional" section of the Hyperlink dialog box.

1. To change the color of the background, the link, visited link and active link colors, go to the File menu and choose Properties. A dialog box will appear. On the General tab, you can change the title of the page.
2. Choose the Background tab to change the color of the background, or the links. You can also add a simple rollover effect here for the links. For example, you could have the link text change to bold face when the user’s cursor is over it.

1. To start a list, position your cursor within the page where you want the list to begin and choose the type of list you want from the Style pulldown list under the File menu. A bullet or number will appear on the page. Simply type in the text you want and hit Enter. The next bullet or number will appear.
2. To end the list, go to the Style menu and choose Normal.
3. To use an image instead of a bullet, or to change the bullet or numbering style, position your cursor within the list and select Format/Bullets and Numbering from the menubar. Changing to a different type of bullet or the numbering style is similar to the way it is done in MSWord. Choose the Plain Bullets tab and select the bullet style you want.
4. To use an image, choose the Picture Bullets tab. If you have an image you want to use, either type the file name in or choose Browse to locate the file. If you want to use ClipArt, choose Browse and click on the ClipArt button at the bottom of the dialog box. ClipArt has a section entitled “Bullets”. Choose one you like and click on it. A pop-up menu will appear. Click on the first icon to insert the bullet type into the list.

1. In FrontPage, select File/New. From the file formats that can be chosen, choose Form Page Wizard. Dialog boxes will appear to lead you through the process.
2. The first dialog box that appears shows the questions that are on the form so far. The list is blank at this time. Click Add in order to add questions.
3. Another dialog box appears with a selection list for the type of information you want to collect with the form. Select Contact Information.
4. A description of what is included with that selection appears in the middle section of the dialog box. You can edit the prompt in the edit pane below the description. Then click Next.
5. Another dialog box appears with a number of radio buttons and checkboxes so that you can select exactly what information you want on your form. The choice at the bottom that asks for the base name for this group of variables can usually be left as is. The base name becomes the pre-fix for all of the variables in the group. When you have made your choices, click Next. You will see the first dialog box again, but now the question list has one item in it.
6. Add another question by clicking Add. This time select any of several options. Change the question to “Select any of the following languages and software that you have experience with:”. Click Next.
7. The next dialog box will ask for a list of the items you want to ask about. Enter the following, with each entry on a separate line. HTML, DHTML, JavaScript, VBScript, ASP, Java, C++, Access Database. Click Next.
8. The first dialog box appears again. Click Finish.
9. The form will be displayed. Right-click on the form. From the pop-up menu that appears, select Page Properties. Change the title to “Application” in the dialog box that appears. Right-click on the form again. From the pop-up menu that appears, select Form Properties. We want to email the results, so fill in an email address in the second box. Then click on the Options button at the bottom of the dialog box.
10. In the dialog box that appears, choose the Email Results tab so that we can check how the results will be sent. On the Email Results page, fill in “web application” on the subject line. Complete this box by clicking OK. Then click OK on the Form Properties dialog box.
11. On the form itself, change the header at the top to “Application”. Below that, delete the line of text put there by FrontPage and add a line saying that the user can apply for the position online by filling out and submitting this form.
12. Let’s change the label on the Submit Form button. Click on the button so that it is highlighted. Right-click for a pop-up menu. Select Form Field Properties from the menu. Change the label to “Submit application”. Follow the same procedure to change the label on the “reset form” button to “Clear Application”.
13. Save the form as an HTML file. Make sure that the file is saved in its own directory on the Windows Server under your account.
14. Because of the security permissions on our server, we need to change the security permissions on that folder ourselves. Go to My Computer on your desktop. Go to your W: drive and to the folder in which you saved your form file. Right-click on the background of the drive, not on the file. From the pop-up menu that appears, select Properties. On the dialog box that appears, choose the Security tab. In the list box, select Internet Guest Account (CISDEPT/IUSR_…). In the bottom pane, check the box under “Allow” and next to “Write”. This gives the form permission to write to this directory.

15.14.1 Tasks

1. To add a task that is associated with a specific page, in Page view, go to the Edit menu and choose Task (it is at the very bottom of the Edit menu). A dialog box will appear.
2. Fill in a name for the task, such as “Add email address of webmaster”. You can assign a priority from “Low” to “High” and provide a longer description if needed. And then click on OK.
3. Adding tasks can also be done from other views, like the Folder View or the Navigation view using a similar process. Simply highlight the file you want to associate with the task and right-click it. Then choose Add Task and continue as in the step above.
4. You can also add a task that is not associated with any file by starting in Task View and proceeding as in step 1. Or just right click in the Task View pane and a pop-up menu will appear with Add Task as one of the choices.
5. To edit a task, highlight the task in Task View and right-click on it. A pop-up menu will appear. If the task is associated with a particular file, you can choose Start Task and that file will be opened in Page View. You can mark a task as completed or delete a task from the same pop-up menu.

15.14.2 Reports View

15.14.3 Navigation View

1. To add a page underneath another page, simply click on the file in the Folder View and drag it to the page you want it to be under.
2. You can change the structure by dragging a file from one page to another.
3. You can also change the titles of the pages in Navigation View. To do this, click on the page, pause and then click on it again. You will be able to type directly in the page with the Navigation view. Alternatively, you can right-click on the page and choose Properties from the pop-up menu that appears.
4. Once you have the structure of the web site developed in Navigation View, you can add Navigation Bars in page view. Open the home page for your web in Page View. Right-click on the page and choose Shared Borders and Apply to All pages in the dialog box that appears. Next, add a Navigation Bar to each page by positioning your cursor at the top of a page and choosing Insert/Navigation Bar. A dialog box will appear that depicts a generic hierarchical structure. Choose the type of navigation that best suits what you want. The pages that will be linked will be highlighted in the hierarchical structure on the box. For the home page, choose Child Level and then click OK. The Navigation Bar will contain links to the child pages you designated in Navigation View. For the lower level pages, after inserting the navigation bar, you may want to choose Parent level which will add a link back to the home page.

15.14.4 Hyperlinks View

15.14.5 Other Management Tools Available

15.14.6 Administrative Tools

1. To delete a webpage from a web, simply go to the folder view, select the file you want to delete and hit the Delete key.
2. To delete an entire web, in the folder view, highlight the top folder for the web and hit Delete Key. A dialog box will be displayed, asking if you want to delete the FrontPage attributes of this web or if you want to delete the entire web. Choosing to delete the entire web is a permanent action and cannot be reversed. But, doing this will remove all of the related files that are created for you by FrontPage. Choosing to delete the FrontPage attributes converts the web into a set of ordinary files and folders. You may want to do this if you are going to move a web that was developed on disk and move it to a non-MicroSoft server. Some aspects of FrontPage that you may have included, like image maps, will be deleted if this is chosen.
3. To remove a page from a web, without totally deleting it, right-click on the file in the Folder view. A pop-up menu will appear. Choose Cut from the menu.

1. Select File/Publish Web from the menubar.
2. A dialog box will appear. In the location box at the top of the dialog box, you will enter the address of the server and any subdirectories needed. If your server uses the FrontPage extensions, you can publish your web site using HTTP. If it does not, you should use FTP, so delete the “http:” from the location box and type in “ftp:”. Follow the protocol with the address of the server and any subdirectories. E.g., “cis2.stvincent.edu/martincc/courses”.

References

1. Plotkin, David (2001) How to do everything with FrontPage 2002. New York:Osborne/McGraw-Hill.
2. Randall, N. and Jones, D. (1999) Using Microsoft FrontPage 2000: Special Edition. Indianapolis, IN: QUE.